<template>
	<BasicModal v-bind="$attrs" @register="registerModal" destroyOnClose :title="title" :width="800" @ok="handleSubmit">
		<BasicForm @register="registerForm">
			<!-- <template #userList="{ model, field }">
				<a-input-number v-model:value="model[field]" placeholder="录入报名人数"
					@change="inputUserNum"></a-input-number>
				<card v-if="userNum>0">
					<userInfo :userNum="userNum"></userInfo>
				</card>
			</template> -->
			<template #userInfo="{ model, field }">
				<a-input-search v-model:value="model[field]" placeholder="粘贴人员信息"
					@search="userInfoApi"></a-input-search>
			</template>


		</BasicForm>
	</BasicModal>
</template>

<script lang="ts" setup>
	import { ref, computed, unref, inject } from 'vue';
	import { BasicModal, useModalInner } from '/@/components/Modal';
	import { BasicForm, useForm } from '/@/components/Form/index';
	import { coupleActivityOrderFbFormSchema } from '../CoupleActivityCarpoolBus.data';
	import { coupleActivityOrderSaveOrUpdate,verificationOfIdentityCardApi} from '../CoupleActivityCarpoolBus.api';

	//接收主表id
	const mainId = inject('mainId');
	const userNum = ref(0)
	// Emits声明
	const emit = defineEmits(['register', 'success']);
	const isUpdate = ref(true);


	//表单配置
	const [registerForm, { setProps, resetFields, setFieldsValue, validate, getFieldsValue }] = useForm({
		//labelWidth: 150,
		schemas: coupleActivityOrderFbFormSchema,
		showActionButtonGroup: false,
		baseColProps: { span: 24 }
	});


	async function userInfoApi(e) {
		let obj = await verificationOfIdentityCardApi({ info: e })
		console.log(obj)
		 setFieldsValue({
			userPhone:obj.userPhone,
			userName: obj.userName,
			userCard:obj.userCard
		});
	}


	//表单赋值
	const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {

		//重置表单
		await resetFields();
		setModalProps({ confirmLoading: false, showCancelBtn: !!data?.showFooter, showOkBtn: !!data?.showFooter });
		isUpdate.value = !!data?.isUpdate;
		if (unref(isUpdate)) {
			//表单赋值
			await setFieldsValue({
				...data.record,
				isUpdate: isUpdate.value
			});
		}
		// 隐藏底部时禁用整个表单
		setProps({ disabled: !data?.showFooter })
	});
	//设置标题
	const title = computed(() => (!unref(isUpdate) ? '新增' : '编辑'));
	//表单提交事件
	async function handleSubmit(v) {
		try {
			let values = await validate();
			values.roolOrIn = 0
			values.registrationPopulation = 1
			values.carpoolBus = mainId.value
			setModalProps({ confirmLoading: true });
			/* 	if (unref(mainId)) {
					values['carpoolBus'] = unref(mainId);
				} */
			//提交表单
			await coupleActivityOrderSaveOrUpdate(values, isUpdate.value);
			//关闭弹窗
			closeModal();
			//刷新列表
			emit('success');
		} finally {
			setModalProps({ confirmLoading: false });
		}
	}
</script>
<style lang="less" scoped>
	/** 时间和数字输入框样式 */
	:deep(.ant-input-number) {
		width: 100%
	}

	:deep(.ant-calendar-picker) {
		width: 100%
	}

	.jeecg-basic-form .ant-input {
		font-size: 13px;
		height: 40px;
	}
</style>